<template>
	<view>
		<u-sticky>
			<view class="flexbetween ffffff mainpadding">
				<view class="ssousuobox" style="width: 80%;">
					<view class="flexleft">
						<u-icon class="margin_right1" name="search" size="28"></u-icon>
						<input type="text" placeholder="请输入城市名称" v-model="keywords">
					</view>
				</view>
				<view class="ershiba xiaohei nofonweight" @click="getcityList">搜索</view>
			</view>
		</u-sticky>
		<view class="flexbetween mainpadding">
			<view class="ershiba xiaohei nofonweight ">定位：{{cityinfo.name}}</view>
			<view class="xiaolv smalltext" @click="getlocation">获取当前位置</view>
		</view>
		<view class="">
			<u-index-list :index-list="indexList">
				<template v-for="(item, index) in itemArr">
					<u-index-item>
						<u-index-anchor :text="item.key"></u-index-anchor>
						<view class="list-cell" v-for="(cell, inde) in item.list" :key="inde" @click="checkcity(cell)">
							{{cell.name}}
						</view>
					</u-index-item>
				</template>
			</u-index-list>
		</view>

	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				indexList: [],
				itemArr: [],
				cityinfo:{},
				keywords:"",
				type:0
			}
		},
		onLoad(options) {
			if(options.type){
				this.type = options.type
			}
			let cityinfo = uni.getStorageSync("cityinfo")
			if(cityinfo.id){
				this.cityinfo = cityinfo
			}
			this.getcityList()
		},
		methods: {
			checkcity(item){
				this.cityinfo = {
					name:item.name,
					lat:item.lat,
					lng:item.lng,
					id:item.id,
					pid:item.pid
				}
				if(this.type==1){
					uni.$emit("checkaddress",item)
					uni.navigateBack(1)
					return false
				}
				uni.setStorageSync("cityinfo",this.cityinfo)
				
			},
			getcityList() {
				httpRequest.request('/api/index/getCityList', 'POST', {
					keywords:this.keywords
				}, false, false, true).then(res => {
					let indexList = []
					res.data.forEach(item=>{
						indexList.push(item.key)
					})
					this.itemArr = res.data
					this.indexList = indexList
				})
			},
			getlocation() {
				let _this = this
				uni.getLocation({
					type: 'wgs84',
					geocode: true,
					success: function(res) {
						_this.lat = res.latitude
						_this.lng = res.longitude
						_this.getcityInfo()
					},fail(err){
						console.log(err);
					}
				});
			},
			getcityInfo(){
				httpRequest.request('/api/index/getCurrCity', 'POST', {
					lat: this.lat,
					lng: this.lng
				}, false, false, true).then(res => {
					this.cityinfo = {
						name:res.data.name,
						lat:res.data.lat,
						lng:res.data.lng,
						id:res.data.id,
						pid:res.data.pid
					}
					uni.setStorageSync("cityinfo",this.cityinfo)
				})
			},
			
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background: #F9F9FA;
	}

	.list-cell {
		display: flex;
		box-sizing: border-box;
		width: 100%;
		padding: 10px 24rpx;
		overflow: hidden;
		color: #323233;
		font-size: 14px;
		line-height: 24px;
		background-color: #fff;
	}
</style>